.top_header{

    background-color: #d90d13;

    line-height: 40px;

}



.top_header_all{

    font-size: 16px;

    color: #fff;

}



.top_header_all div:last-child{

    float: right;

}



.top_header_all div:first-child{

    float: left;

}



.top_header_all div:nth-child(2){

    float: left;

    padding-left: 250px;

}



.top_header_all a{

    color: #fff;

}



.top_header_all a:first-child{

    padding-right: 20px;

}







.header_nav{

    width: 100%;

    position: relative;

    z-index: 99;

}



.header_top{

    width: 100%;

    z-index: 10;

}

.logo{

    float: left;

    padding-top: 12px;

}

.header_li{

    float: right;

}

.header_li ul li{

    float: left;

    padding: 35px 30px;

    position: relative;

}

.header_li ul li a{

    color: #000;

    font-size: 16px;

    text-decoration: none;

}

.header_li ul li:hover{

    background-color: #d90d13;

}

.header_li ul li:hover a{

    color: #fff;

}

.header_phone{

    float: right;

    padding-top: 15px;

}

.header_phone span:first-child{

    font-size: 16px;

}

.header_phone span:nth-child(2){

    color: #e45256;

    font-size: 20px;

    font-weight: bold;

}



























.nav{

    display: flex;

}

.nav a{

    font-size: 16px;

    color: #000;

}



.down_list {

    position: absolute;

    top: 92px;

    left: 0;

    width: 100%;

    text-align: center;

    background: #d90d13;

    display: none;

    z-index: 999;

}

.header_li ul li:hover .down_list {

    display: block;

}

.down_list> a {

    display: block;

    text-align: center;

    line-height: 25px;

    font-size: 18px;

    color: #fff;

}



.header_li ul li:hover .down_list a {

    border-top: none;

    width: 100%;

    padding: 10px 0;

}

.header_li ul li .down_list a:hover {

    background: #ce050b;

    color: #fff;

}









.nav> li .down_list{position: absolute;width:100%;background-color: #d90d13; display: none;z-index:999;top: 60px;}

.nav> li .down_list> a{display: block;text-align: center;line-height:30px;font-size:16px;color:#fff;padding: 10px; border-bottom: 1px solid #d90d13; box-sizing: border-box;}

.nav> li .down_list> a:hover{color:#fff;background-color: #d90d13;}

.nav> li:hover .down_list{display: block;}





@media(min-width:768px){

    .header{

        display: none;

    }

}







@media(max-width: 768px){

    .logo{

        padding-top: 0;

    }

    .header_nav{

        padding: 0;

    }

    .header-top-all{

        height: 110px;

    }



    header.navbar,.header{

        position: relative;

        top: -100px;

    }

    header.navbar{

        z-index: 1;

    }



    .header_li,.heard{

        display: none;

    }



    .header_bottom .nav li a:hover{background:none;}



    .header .header_top{display:none;}



    .header .head_mid{height: 100px;position: relative;z-index: 99;width: 50%;margin-left: 207px;}



    .header .head_mid .nav_btn i{display: block;width:25px;height:2px;background: #7a7a7a;margin:8px auto;}



    .header .head_mid .nav_btn{position:absolute;right:17px;top:35px;}



    .header_bottom .nav> li{background-image: none;}



    .header_bottom{height: auto;}



    .header_bottom .header_bottom_con{padding:0;}



    .header_bottom .nav{position: absolute;z-index:999;background:#fff;width: 100%;display: none;}



    .header_bottom .nav> li{float: none;border-bottom: 1px solid #d9d9d9;width:100%;position: relative;}



    .header_bottom .nav li> a{font-size: 16px;color:#333;}



    .header .nav> li:nth-child(2)::after{display: block;content:"";border-left:2px solid #888;border-bottom: 2px solid #888;position:absolute;top:20px;right:10px;width:10px;height:10px;transform: rotate(135deg);transition: 0.5s;}

    .header .nav> li:nth-child(3)::after{display: block;content:"";border-left:2px solid #888;border-bottom: 2px solid #888;position:absolute;top:20px;right:10px;width:10px;height:10px;transform: rotate(135deg);transition: 0.5s;}

    .header .nav> li:nth-child(4)::after{display: block;content:"";border-left:2px solid #888;border-bottom: 2px solid #888;position:absolute;top:20px;right:10px;width:10px;height:10px;transform: rotate(135deg);transition: 0.5s;}

    .header .nav> li:nth-child(5)::after{display: block;content:"";border-left:2px solid #888;border-bottom: 2px solid #888;position:absolute;top:20px;right:10px;width:10px;height:10px;transform: rotate(135deg);transition: 0.5s;}

    .header .nav> li:nth-child(6)::after{display: block;content:"";border-left:2px solid #888;border-bottom: 2px solid #888;position:absolute;top:20px;right:10px;width:10px;height:10px;transform: rotate(135deg);transition: 0.5s;}

    .header .nav> li:nth-child(7)::after{display: block;content:"";border-left:2px solid #888;border-bottom: 2px solid #888;position:absolute;top:20px;right:10px;width:10px;height:10px;transform: rotate(135deg);transition: 0.5s;}



    .header_bottom .nav> li .down_list{position:static; background: none;display:none}



    .header_bottom .nav> li .down_list> a{color:#333;border-bottom: 1px solid #d9d9d9;   background: #f2f2f2!important;}



    .header_bottom .nav> li.on::after{transform: rotate(310deg);border-left:2px solid #000;border-bottom:2px solid #000;transition: 0.5s;}



    .header_bottom .nav >li.on a{background:#fff;}



    .header_top{

        width: auto;

    }

    .top_header{
        display: none;
    }

    .header_nav{

        height: 100px;

        line-height: 100px;

    }



    .logo img{

        width: 80%;

        padding-top: 20px;

    }



    #mob_banner .swiper-wrapper .swiper-slide{

        height: 300px;

    }

}